<template>
  <div v-loading="loading">
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" class="dataForm">
      <el-row>
        <el-col :span="12">
          <el-form-item :label="$t('项目序号')" align="center" prop="num" min-width="210">
            <el-input-number v-model="form.num" :controls="false" :placeholder="$t('项目序号')" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目企业名称')" align="center" prop="projectName" min-width="210">
            <el-input v-model="form.projectName" :placeholder="$t('项目企业名称')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('是否海外投资')" align="center" prop="overseasInvest" min-width="210">
            <el-select
              v-model="form.overseasInvest"
              :placeholder="$t('是否海外投资')"
            >
              <el-option value="是">是</el-option>
              <el-option value="否">否</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目企业统一社会信用编码')" align="center" prop="creditCode" min-width="210">
            <el-input v-model="form.creditCode" :placeholder="$t('项目企业统一社会信用编码')" show-word-limit maxlength="50" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目企业成立日期')" align="center" prop="projectCompanyEstablishDate" min-width="210">
            <el-date-picker
              v-model="form.projectCompanyEstablishDate"
              clearable
              style="width: 200px"
              type="date"
              value-format="yyyy-MM-dd"
              :placeholder="$t('项目企业成立日期')"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目企业注册地')" align="center" prop="registration" min-width="210">
            <el-input v-model="form.registration" :placeholder="$t('项目企业注册地')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目企业股票代码')" align="center" prop="stockCode" min-width="210">
            <el-input v-model="form.stockCode" :placeholder="$t('项目企业股票代码')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('投资行业')" align="center" prop="investIndustry" min-width="210">
            <el-select v-model="form.investIndustry" :placeholder="$t('投资行业')" filterable>
              <el-option value="能源开采设备与服务" />
              <el-option value="石油与天然气" />
              <el-option value="煤炭" />
              <el-option value="化学原料" />
              <el-option value="化学制品" />
              <el-option value="建筑材料" />
              <el-option value="容器与包装" />
              <el-option value="有色金属" />
              <el-option value="钢铁" />
              <el-option value="非金属采矿及制品" />
              <el-option value="纸类与林业产品" />
              <el-option value="航空航天与国防" />
              <el-option value="建筑产品" />
              <el-option value="建筑与工程" />
              <el-option value="电气设备" />
              <el-option value="工业集团企业" />
              <el-option value="机械制造" />
              <el-option value="环保设备、工程与服务" />
              <el-option value="商业服务与用品" />
              <el-option value="航空货运与物流" />
              <el-option value="航空公司" />
              <el-option value="航运" />
              <el-option value="道路运输" />
              <el-option value="交通基本设施" />
              <el-option value="汽车零配件与轮胎" />
              <el-option value="汽车与摩托车" />
              <el-option value="家庭耐用消费品" />
              <el-option value="休闲设备与用品" />
              <el-option value="纺织服装" />
              <el-option value="珠宝与奢侈品" />
              <el-option value="酒店、餐馆与休闲" />
              <el-option value="综合消费者服务" />
              <el-option value="传媒" />
              <el-option value="日用品经销商" />
              <el-option value="互联网零售" />
              <el-option value="多元化零售" />
              <el-option value="其他零售" />
              <el-option value="食品与主要用品零售" />
              <el-option value="饮料" />
              <el-option value="包装食品与肉类" />
              <el-option value="烟草" />
              <el-option value="农牧渔产品" />
              <el-option value="家常用品" />
              <el-option value="个人用品" />
              <el-option value="医疗器械" />
              <el-option value="医疗用品与服务提供商" />
              <el-option value="生物科技" />
              <el-option value="制药" />
              <el-option value="制药与生物科技服务" />
              <el-option value="商业银行" />
              <el-option value="抵押信贷机构" />
              <el-option value="其他金融服务" />
              <el-option value="消费信贷" />
              <el-option value="资本市场" />
              <el-option value="保险" />
              <el-option value="房地产开发与园区" />
              <el-option value="房地产管理与服务" />
              <el-option value="房地产投资信托(REITs)" />
              <el-option value="互联网服务" />
              <el-option value="信息技术服务" />
              <el-option value="软件开发" />
              <el-option value="电脑与外围设备" />
              <el-option value="电子设备" />
              <el-option value="半导体" />
              <el-option value="电信运营服务" />
              <el-option value="电信增值服务" />
              <el-option value="通信设备" />
              <el-option value="电力" />
              <el-option value="燃气" />
              <el-option value="供热或其他公用事业" />
              <el-option value="水务" />
              <el-option value="电网" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('地产类型')" align="center" prop="propertyType" min-width="210">
            <el-autocomplete
              v-model="form.propertyType"
              class="inline-input"
              :fetch-suggestions="propertyTypeQuerySearch"
              :placeholder="$t('地产类型')"
              show-word-limit
              :maxlength="150"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('投资阶段')" align="center" prop="investStage" min-width="210">
            <el-input v-model="form.investStage" :placeholder="$t('投资阶段')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目投资账面价值')" align="center" prop="projectInvestBookValue" min-width="210">
            <Money v-model="form.projectInvestBookValue" :placeholder="$t('项目投资账面价值')" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('其中：股权投资账面价值')+ $t('(元)')" align="center" prop="equityInvestBookValue" min-width="210">
            <Money v-model="form.equityInvestBookValue" :placeholder="$t('其中：股权投资账面价值')" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('股权投资估值方法')" align="center" prop="equityInvestValuationMethod" min-width="210">
            <el-autocomplete
              v-model="form.equityInvestValuationMethod"
              class="inline-input"
              :fetch-suggestions="querySearch"
              :placeholder="$t('股权投资估值方法')"
              show-word-limit
              :maxlength="150"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('占被投资单位股权比重(%)')" align="center" prop="investEquityProportion" min-width="210">
            <Money v-model="form.investEquityProportion" :placeholder="$t('占被投资单位股权比重(%)')" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('其中：债权投资账面价值')+ $t('(元)')" align="center" prop="bondInvestBookValue" min-width="210">
            <Money v-model="form.bondInvestBookValue" :placeholder="$t('其中：债权投资账面价值')" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('债权投资估值方法')" align="center" prop="bondInvestValuationMethod" min-width="210">
            <el-autocomplete
              v-model="form.bondInvestValuationMethod"
              class="inline-input"
              :fetch-suggestions="querySearch"
              :placeholder="$t('债权投资估值方法')"
              show-word-limit
              :maxlength="150"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目投资日期及投资本金')+ $t('(元)')" align="center" prop="projectInvestDateAndPrincipal" min-width="210">
            <el-input v-model="form.projectInvestDateAndPrincipal" :placeholder="$t('项目投资日期及投资本金')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('其中：股权投资日期、投资本金及标的来源')+ $t('(元)')" align="center" prop="projectInvestDateAndPrincipalSource" min-width="210">
            <el-input v-model="form.projectInvestDateAndPrincipalSource" :placeholder="$t('其中：股权投资日期、投资本金及标的来源')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('其中：债权投资日期、投资本金、标的来源及债权类别')+ $t('(元)')" align="center" prop="investType" min-width="210">
            <el-input v-model="form.investType" :placeholder="$t('其中：债权投资日期、投资本金、标的来源及债权类别')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('退出情况')" align="center" prop="exitSituation" min-width="210">
            <el-select
              v-model="form.exitSituation"
              :placeholder="$t('退出情况')"
            >
              <el-option value="完全退出">完全退出</el-option>
              <el-option value="部分退出">部分退出</el-option>
              <el-option value="未退出">未退出</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('退出信息')" align="center" prop="exitInfo" min-width="210">
            <el-input v-model="form.exitInfo" type="textarea" :placeholder="$t('退出信息')" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('是否属于中小企业')" align="center" prop="smes" min-width="210">
            <el-select
              v-model="form.smes"
              :placeholder="$t('是否属于中小企业')"
            >
              <el-option value="是">是</el-option>
              <el-option value="否">否</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('是否属于高新技术企业')" align="center" prop="highTechEnterprises" min-width="210">
            <el-select
              v-model="form.highTechEnterprises"
              :placeholder="$t('是否属于高新技术企业')"
            >
              <el-option value="是">是</el-option>
              <el-option value="否">否</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('是否属于初创科技型企业')" align="center" prop="startUpTechnologyCompanies" min-width="210">
            <el-select
              v-model="form.startUpTechnologyCompanies"
              :placeholder="$t('是否属于初创科技型企业')"
            >
              <el-option value="是">是</el-option>
              <el-option value="否">否</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目企业控股性质')" align="center" prop="holdingNature" min-width="210">
            <el-select
              v-model="form.holdingNature"
              :placeholder="$t('项目企业控股性质')"
            >
              <el-option value="中央国有控股">中央国有控股</el-option>
              <el-option value="地方国有控股">地方国有控股</el-option>
              <el-option value="社团集体控股">社团集体控股</el-option>
              <el-option value="自然人控股">自然人控股</el-option>
              <el-option value="外商控股">外商控股</el-option>
              <el-option value="控股主体性质不明确">控股主体性质不明确</el-option>
              <el-option value="无控股主体">无控股主体</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('是否享受国家财税政策')" align="center" prop="nationalFiscalPolicy" min-width="210">
            <el-select
              v-model="form.nationalFiscalPolicy"
              :placeholder="$t('是否享受国家财税政策')"
            >
              <el-option value="是">是</el-option>
              <el-option value="否">否</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('投资风控基本情况')" align="center" prop="investRiskControl" min-width="210">
            <el-input v-model="form.investRiskControl" :placeholder="$t('投资风控基本情况')" show-word-limit maxlength="100" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('项目所属行业景气程度较去年同期')" align="center" prop="industryBoom" min-width="250">
            <el-select v-model="form.industryBoom" :placeholder="$t('项目所属行业景气程度较去年同期')">
              <el-option value="上升" />
              <el-option value="持平" />
              <el-option value="下降" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('管理人认为项目公司当前的主要机遇')" align="center" prop="mainOpportunity" min-width="250">
            <el-input v-model="form.mainOpportunity" type="textarea" :placeholder="$t('管理人认为项目公司当前的主要机遇')" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('管理人认为项目公司当前的主要风险')" align="center" prop="mainRisk" min-width="250">
            <el-input v-model="form.mainRisk" type="textarea" :placeholder="$t('管理人认为项目公司当前的主要风险')" show-word-limit maxlength="1000" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div v-if="!btnHide && processBtn" slot="footer" class="dialog-footer" style="text-align: right;">
      <!--保存 取消按钮-->
      <save-btn has-permi="fund:monitor" :cancel-func="cancel" />
    </div>
  </div>
</template>

<script>
import { getFundProjectStatus, saveFundProjectStatus } from '@/api/fund/operation/fundProjectStatus'
export default {
  data() {
    return {
      // 表单参数
      form: {
        monitorId: undefined
      },
      // 遮罩层
      loading: false,
      // 表单校验
      rules: {
        projectName: [{ required: true, message: this.$t('必填信息'), trigger: 'blur' }]
      },
      processBtn: true,
      btnHide: false
    }
  },
  created() {
  },
  methods: {
    // 初始化数据
    init(data) {
      this.loading = true
      this.processBtn = data.processBtn
      this.form.monitorId = data.monitorId
      this.btnHide = data.btnHide
      if (data.id !== undefined) {
        getFundProjectStatus(data.id).then(response => {
          this.form = response.data
          this.loading = false
        })
      } else {
        this.reset()
        this.form.num = data.total + 1
        this.loading = false
      }
    },
    // 表单重置
    reset() {
      this.form = {
        id: undefined,
        monitorId: this.form.monitorId,
        projectName: undefined,
        overseasInvest: undefined,
        creditCode: undefined,
        projectCompanyEstablishDate: undefined,
        registration: undefined,
        stockCode: undefined,
        investIndustry: undefined,
        investStage: undefined,
        projectInvestBookValue: undefined,
        equityInvestBookValue: undefined,
        equityInvestValuationMethod: undefined,
        investEquityProportion: undefined,
        bondInvestBookValue: undefined,
        bondInvestValuationMethod: undefined,
        projectInvestDateAndPrincipal: undefined,
        projectInvestDateAndPrincipalSource: undefined,
        investType: undefined,
        exitSituation: undefined,
        exitInfo: undefined,
        smes: undefined,
        highTechEnterprises: undefined,
        startUpTechnologyCompanies: undefined,
        nationalFiscalPolicy: undefined,
        investRiskControl: undefined,
        industryBoom: undefined,
        mainOpportunity: undefined,
        mainRisk: undefined,
        createBy: undefined,
        createTime: undefined,
        updateBy: undefined,
        updateTime: undefined
      }
      this.resetForm('form')
    },
    // 取消按钮
    cancel() {
      this.reset()
      this.$parent.$parent.formOpen = false
    },
    // 关闭form页面
    closeForm() {
      // 关闭form页面遮罩层
      this.loading = false
      // 关闭form页面
      if (this.$parent.$parent.formOpen !== undefined) {
        this.$parent.$parent.formOpen = false
        this.$parent.$parent.getList({ id: this.form.monitorId })
      }
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs['form'].validate(valid => {
        if (valid) {
          this.loading = true
          saveFundProjectStatus(this.form).then(response => {
            if (response.code === 200) {
              this.msgSuccess(this.$t('保存成功'))
              this.closeForm()
            } else {
              this.msgError(response.msg)
            }
            this.loading = false
          })
        } else {
          this.locationError(document)
        }
      })
    },
    querySearch(queryString, cb) {
      var restaurants = [{ value: '按成本估值' }, { value: '按实际利率和摊余成本估值' }, { value: '按公允价值估值' }, { value: '其他估值方法' }]
      var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants
      // 调用 callback 返回建议列表的数据
      cb(results)
    },
    propertyTypeQuerySearch(queryString, cb) {
      var restaurants = [{ value: '酒店' }, { value: '写字楼' }, { value: '购物中心' },
        { value: '商住综合体' }, { value: '普通住宅' }, { value: '保障性住房' }, { value: '物流仓储' }, { value: '数据中心' }, { value: '产业园区' },
        { value: '其他地产类型' }, { value: '不持有不动产' }
      ]
      var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants
      // 调用 callback 返回建议列表的数据
      cb(results)
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (restaurant.value.toLowerCase().includes(queryString.toLowerCase()))
      }
    }
  }
}
</script>
